<template>
  <div class="hello">
    <h3 @click="ck">earthSdk</h3>
    <!-- <Amap :paths="path"/> -->
    <input v-model="width" type="number"/>
    <input v-model="height" type="number"/>
    <img :style="{ width: `${width}px`, height: `${height}px` }" src="https://smartiot-china.oss-cn-beijing.aliyuncs.com/svg/其他设备/Bin 2.svg" />
  </div>
</template>

<script>
// import Amap from '@/pages/index';
export default {
  name: 'HelloWorld',
  // components: {Amap},
  data () {
    return {
      width: 100,
      height: 100,
      path: [[116.42657,39.918201],[116.419446,39.909774],[116.450125,39.909774],[116.450125,39.920702]]
    };
  },
  props: {
    msg: String
  },
  mounted () {
  },
  methods: {
    ck () {
      this.$confirm({
        title: 'Do you want to delete these items?',
        content: 'When clicked the OK button, this dialog will be closed after 1 second',
        onOk() {
          alert(11);
        },
        onCancel() {},
      });
    }
  }
};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
h3 {
  margin: 40px 0 0;
  font-size: 30px;
}
ul {
  list-style-type: none;
  padding: 0;
}
li {
  display: inline-block;
  margin: 0 10px;
}
a {
  color: #42b983;
}
img {
  border: 1px solid #ccc;
}
</style>
